<template>
	<view>
	
		<view class="pl5 pr5 mt2">
			<up-input placeholder="班级名称" prefixIcon="search"></up-input>
		</view>
		
		<view style="display: flex;" class="ml5 mr5">
			<view class="title" style="flex: 1;">班级列表</view>
			<view class="pt5"><u-button size="mini" type="primary"
					@click="handleCreateClass">创建班级</u-button></view>
		</view>
		
		<up-cell-group>
				<up-cell icon="setting-fill" title="个人设置"></up-cell>
				<up-cell icon="integral-fill" title="会员等级" value="新版本"></up-cell>
		</up-cell-group>
		
		
		
		<view>
			

			<up-cell isLink v-for="(item,index) in classList" :key="index" @click="handleClassDetail(index,item)">
				<view slot="title">
					<text style="background-color: #aaff7f; padding:2px 5px">{{item.title}}</text>
				</view>
				<view slot="label" style="display: flex; font-size: 12px; line-height: 30px; color: #999;">
					<view>课程: {{item.course}}</view>
					<view style="margin-left: 10px;">教师: {{item.teacher}}</view>
				</view>
				<view slot="value">
					<view>{{item.stucount}}学员</view>
				</view>
			</up-cell>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				classList: [{
						classid: "0001",
						title: "小苗班",
						course: "拉丁舞初级",
						stucount: 2,
						teacher: "张三"
					},
					{
						classid: "002",
						title: "经营班",
						course: "拉丁舞高级",
						stucount: 10,
						teacher: "李四"
					}
				]
			}
		},
		methods: {
			handleCreateClass() {
				uni.navigateTo({
					url: "/pages/class/create"
				})
			},
			handleClassDetail(index, item) {
				console.log(index, item);
				uni.navigateTo({
					url: "/pages/class/detail?classid=" + item.classid
				})
			}
		}
	}
</script>

<style>

</style>